import { Card, Col, Pagination, Row, Table, Tag, Tree,Button } from 'antd'
// import React, { useEffect, useState } from 'react'
// import { useNavigate, useParams } from 'react-router-dom'
// // 引入请求
// import {
//   getHosDepartmentListRequest,
//   getScheduleRuleRequest,
//   getFindScheduleRequest
// } from '@api/hospital/hospitalList'

// // 引入类型
// import {
//   DepartmentListReturnType,
//   bookingScheduleListType,
//   findeScheduleReturnType
// } from '@api/hospital/model/hospitalListType'

// export default function HosSchedule() {
//   const navigate = useNavigate()
//   const { hoscode } = useParams()
//   // console.log(hoscode);

//   // 设置科室的state
//   const [departmentList, setDepartmentList] = useState<DepartmentListReturnType>([])
//   // 设置当前页码的state
//   const [page, setPage] = useState(1)
//   // 设置一页有几条数据的state
//   const [limit, setLimit] = useState(3)
//   // 设置排班规则的总条数
//   const [total, setTotal] = useState(0)
//   // 设置科室排班的depcode的状态
//   const [depcode, setDepcode] = useState('200040878')
//   // 设置科室排班规则的状态
//   const [scheduleRule, setScheduleRule] = useState<bookingScheduleListType[]>([])
//   // 设置wokeData的state
//   const [workDate,setWorkDate] = useState('2022-04-28')
//   // 设置医师排班情况的state
//   const[doctors,setDoctors]=useState<findeScheduleReturnType>([])

//   // 一进入页面就发送请求获取医院科室相关信息
//   useEffect(() => {
//     const gethosDepartment = async () => {
//       const result = await getHosDepartmentListRequest(hoscode as string)
//       // console.log(result);

//       setDepartmentList(result)

//     }
//     gethosDepartment()
//   }, [])

//   // 一进入页面就发送请求获取医院科室排班规则
//   useEffect(() => {
//     const schedulerule = async () => {
//       const re = await getScheduleRuleRequest({ page, limit, hoscode: hoscode as string, depcode })
//       // console.log(re);
//       setTotal(re.total)
//       setScheduleRule(re.bookingScheduleList)
//       setWorkDate(re.bookingScheduleList[0].workDate)
//     }
//     schedulerule()
//   }, [page,limit,depcode])

//   // 一进入页面就发送请求获取医师排班安排
//   useEffect(()=>{
//     const findSchedule = async()=>{
//     const re =  await getFindScheduleRequest({hoscode:hoscode as string,depcode,workDate})
//     console.log(re,'reeeeeee');
//     setDoctors(re)
//     }
//     findSchedule()
//   },[workDate,depcode])

//   // 树形结构
//   const treeData = [
//     {
//       title: 'parent 1',
//       key: '0-0',
//       children: [
//         {
//           title: 'parent 1-0',
//           key: '0-0-0',

//           children: [
//             {
//               title: 'leaf',
//               key: '0-0-0-0',

//             },
//             {
//               title: 'leaf',
//               key: '0-0-0-1',
//             },
//           ],
//         },
//         {
//           title: 'parent 1-1',
//           key: '0-0-1',
//           children: [{ title: <span style={{ color: '#1890ff' }}>sss</span>, key: '0-0-1-0' }],

//         },
//       ],
//     },
//   ];
//   // 表格结构
//   const columns = [
//     {
//       title: "序号",
//       render(_: any, __: any, index: number) {
//         return index + 1;
//       },
//     },
//     {
//       title: "职称",
//       dataIndex: "title",
//     },
//     {
//       title: "号源时间",
//       dataIndex: "workDate",
//     },
//     {
//       title: "可预约数",
//       dataIndex: "reservedNumber",
//     },
//     {
//       title: "挂号费用",
//       dataIndex: "amount",
//     },
//     {
//       title: "擅长技能",
//       dataIndex: "skill",
//     },
//   ];

//   // 树标签的样式
//   const TreeStyle = {
//     border: '1px solid #000',
//     height: '480px',
//     overflow: 'auto',
//   }
//   return (
//     <div>

//       <Card>
//         <p>选择：北京协和医院/多发性硬化专科门诊/2022-04-28</p>
//         <Row>
//           <Col span={4}>
//             <div style={TreeStyle}>
//               <Tree
//               onSelect={(depCode:any)=>{
//                 setDepcode(depCode[0])        
//               }}
//                 treeData={
//                   departmentList as []
//                 }
//                 fieldNames={
//                   {
//                     title: 'depname',
//                     key: 'depcode'
//                   }
//                 }
//                 expandedKeys={['a4e171f4cf9b6816acdfb9ae62c414d7']}
//               />
//             </div>
//           </Col>
//           <Col span={20}>
//             <div style={{ marginLeft: '20px', marginBottom: '20px' }}>
//               {
//                 scheduleRule.map((item,index) => {
//                   return (
//                     <Tag key={index} onClick={()=>{
//                       setWorkDate(item.workDate)
//                     }} style={{cursor:'pointer'}}>
                      
//                       <p>{item.workDate} {item.dayOfWeek}</p>
//                       <p>{item.availableNumber}/{item.reservedNumber}</p>
//                     </Tag>
//                   )
//                 })
//               }
     
//             </div>
//             <div style={{ marginLeft: '20px' }}>
//               <Pagination
//               current={page}
//               pageSize={limit}
//               total={total}
//               pageSizeOptions={[3,5,7]}
//               showSizeChanger={true}
//               onChange={(page,pageSize)=>{
//                 setPage(page)
//                 setLimit(pageSize)
//               }}
//               />
//             </div>
//             <div>
//               <Table
//                 dataSource={doctors}
//                 columns={columns}
//                 rowKey='id'
//                 style={{ marginTop: "20px", marginLeft: '20px' }}
//                 pagination={false}
//                 >
//               </Table>
//               <Button onClick={()=>{navigate(-1)}}  style={{ marginTop: "30px", marginLeft: '20px'}}>返回</Button>
//             </div>
//           </Col>
//         </Row>
//       </Card>
//     </div>
//   )
// }
